<admintpl file="header"/>
<link href="//cdn.bootcss.com/bootstrap/3.3.0/css/bootstrap.min.css" rel="stylesheet">
<link href="__PUBLIC__/simpleboot/bootstrap/css/bootstrap.min.css" rel="stylesheet">

<style>
    .b_box {
        -webkit-border-radius: 5px;
        -moz-border-radius: 5px;
        border-radius: 5px;
        background: #ffffff;
        padding: 10px;
        margin: 10px;
        border: 1px solid #dddddd;
        
    }
</style>
</head>
<body style="background: #f5f5f5;padding-top: 20px">
<div class="container-fluid">
    <div class="row-small">
        <div class="col-xs-12">
            <div class="b_box">
                <div id="tree" style="height:600px;background: #ffffff">


                </div>
            </div>
        </div>
    </div>
</div>
<script src="__PUBLIC__/js/echart/echarts-all.js"></script>
<script type="text/javascript">
    // 基于准备好的dom，初始化echarts图表
    var myChartd = echarts.init(document.getElementById('tree'));
    var tree = {
        title : {
            text: '推荐树'
        },
        toolbox: {
            show : true,
            feature : {
                mark : {show: true},
                dataView : {show: true, readOnly: false},
                restore : {show: true},
                saveAsImage : {show: true}
            }
        },
        series : [
            {
                name:'树图',
                type:'tree',
                orient: 'horizontal',  // vertical horizontal
                rootLocation: {x: 100,y: 230}, // 根节点位置  {x: 100, y: 'center'}
                nodePadding: 8,
                layerPadding: 200,
                hoverable: false,
                roam: true,
                symbolSize: 6,
                itemStyle: {
                    normal: {
                        color: '#4883b4',
                        label: {
                            show: true,
                            position: 'right',
                            formatter: "{b}",
                            textStyle: {
                                color: '#000',
                                fontSize: 5
                            }
                        },
                        lineStyle: {
                            color: '#ccc',
                            type: 'curve' // 'curve'|'broken'|'solid'|'dotted'|'dashed'

                        }
                    },
                    emphasis: {
                        color: '#4883b4',
                        label: {
                            show: false
                        },
                        borderWidth: 0
                    }
                },
                data:[{$trees}]
            }
        ]
    };
    myChartd.setOption(tree);
</script>
<div align="center">
    <input type="hidden" name="mobile" value="{$data.mobile}"/>
    <input type="hidden" name="recom_type" value="{$formget.recom_type}"/>
    <input type="hidden" name="recommended_mobile" value="{$formget.recommended_mobile}"/>
    <input type="hidden" name="recommended_type" value="{$formget.recommended_type}"/>
    <input type="hidden" name="recommended_status" value="{$formget.recommended_status}"/>
    <input type="hidden" name="start_time" value="{$formget.start_time}"/>
    <input type="hidden" name="end_time" value="{$formget.end_time}"/>
    <a class="btn" href="{:U('Operation/recommend_list',array('formget'=>$formget))}">{:L('BACK')}</a>
</div>

</body>
</html>